<template>
	<view>
		<listtwo title="收货人" placeholder="请填写收货人" :iSimg="false" v-model="list.name"></listtwo>
		<listtwo title="联系电话" placeholder="请填写联系电话" :iSimg="false" v-model="list.phone"></listtwo>
		<listtwo title="收货地址" placeholder="请选择省/市/区" :iSimg="true" :value="region" @click="openPicker"></listtwo>
		<listtwo title="详细地址" placeholder="请填写详细信息" :iSimg="false" v-model="list.add_ress"></listtwo>
		<view class="setupButton">
			<view class="setupButton_t">
				<button @click="getsub">保存</button>
			</view>
		</view>
		<lotus-address v-on:choseVal="choseValue" :lotusAddressData="lotusAddressData"></lotus-address>
	</view>
</template>

<script>
	import listtwo from '@/components/listtwo/listtwo.vue'
	import lotusAddress from "../../components/Winglau14-lotusAddress/Winglau14-lotusAddress.vue";
	export default {
		data() {
			return {
				lotusAddressData: {
					visible: false,
					provinceName: '',
					cityName: '',
					townName: '',
				},
				region: '',
				// 参数
				list:{
					id:'',
					name:'',
					phone:'',
					pro_id:'',
					city_id:'',
					area_id:'',
					add_ress:'',
					status:-1,
				}
			}
		},
		components: {
			listtwo,
			lotusAddress
		},
		onLoad(e) {
			if(e.data){
				this.list.id = e.data
				this.init(e.data)
			}
		},
		methods: {
			init(id){
				this.$request("User/AddressList", {
					data: {
				
					},
					isLoad: false
				}).then(res => {
					this.list = res.result.filter(item=>item.id == id)[0]
					this.lotusAddressData.provinceName = this.list.pro_name
					this.lotusAddressData.cityName = this.list.city_name
					this.lotusAddressData.townName = this.list.area_name
					this.region = this.list.pro_name + this.list.city_name +this.list.area_name
				})
			},
			getsub() {
				if(this.list.id){
					this.$request("User/SaveAddress", {
						data: {
							...this.list
						},
						isLoad: false
					}).then(res => {
						this.getback()
					})
				}else{
					this.$request("User/Address", {
						data: {
							...this.list
						},
						isLoad: false
					}).then(res => {
						this.getback()
					})
				}
				
			},
			//打开picker
			openPicker() {
				this.lotusAddressData.visible = true;
			},
			//回传已选的省市区的值
			choseValue(res) {
				//res数据源包括已选省市区与省市区code
				console.log(res);
				this.lotusAddressData.visible = res.visible; //visible为显示与关闭组件标识true显示false隐藏
				//res.isChose = 1省市区已选 res.isChose = 0;未选
				if (res.isChose) {
					this.lotusAddressData.provinceName = res.province; //省
					this.lotusAddressData.cityName = res.city; //市
					this.lotusAddressData.townName = res.town; //区
					this.list.pro_id = res.provinceCode
					this.list.city_id = res.cityCode
					this.list.area_id = res.townCode
					this.region = `${res.province} ${res.city} ${res.town}`; //region为已选的省市区的值
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.setupButton {
		position: fixed;
		bottom: 36rpx;
		width: 100%;

		.setupButton_t {
			padding: 0 32rpx;

			button {
				margin: 0 auto;
				width: 100%;
				height: 80rpx;
				line-height: 80rpx;
				background-color: #F7BC1C;
				font-size: 32rpx;
				color: #323233;
				border-radius: 60rpx;
				font-weight: 600;
			}

			button::after {
				border: none;
			}
		}

	}
</style>
